<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1>
        <i class="fa fa-tachometer" aria-hidden="true"></i> 亚马逊出货订单列表
      </h1>
    </section>
    
    <section class="content">
         <div class="callout callout-info">
            <h4>上传文件</h4>
            你可以通过上传excel文件，来达到快速上传订单。
            <a href="javascript:void(0)" id="uploadExcelBtn">上传Excel</a>
          </div>

    	<table class="table table-striped table-hover table-bordered table-condensed">
    		<thead>
    			<tr>
    				<th>订单编号</th>
    				<th>订单名称</th>
    				<th>关联产品数</th>
    				<th>订单状态</th>
    				<th>创建人</th>
                    <th>创建时间</th>
    				<th>备注</th>
    				<th>操作</th>
    			</tr>
    		</thead>
    		<tbody>
    			<?php
    			foreach ($orders as $key => $order) {
    			?>
    			<tr>
    				<td><?=$order->id?></td>
    				<td><?=$order->order_name?></td>
    				<td><?=$order->details_count?></td>
    				<td>
    					<span class="text-muted">计划中</span>
    					<span class="text-muted">生产中</span>
    					<span class="text-muted">待贴码</span>
    					<span class="text-muted">运输中</span>
    				</td>
    				<td><?=$order->createdBy?></td>
                    <td><?=$order->createdDtm?></td>
    				<td><?=$order->remark?></td>
    				<td>
    					<a href="/amazonOrder/detail/<?=$order->id?>" class="btn btn-xs btn-info">查看</a>
                        <a href="javascript:void(0)" data-id="<?=$order->id?>" class="btn btn-xs btn-danger order-delete">删除</a>
    				</td>
    			</tr>
    			<?php	
    			}
    			?>
    			
    		</tbody>
    	</table>

         <div class="modal modal-primary fade" id="uploadExcelModal">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">选择Excel</h4>
              </div>
              <div class="modal-body">
                <div class="form-group">
                  <label for="exampleInputFile">亚马逊订单Excel</label>
                  <input type="file" id="amazonOrderExcelFile">
                  <p>请选择格式正确的亚马逊订单文件.</p>
                </div>
              </div>
              <div class="modal-footer">
                <button type="button" class="btn btn-default pull-left" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" id="uploadExcelAndCreateOrder">上传并创建订单</button>
              </div>
            </div>
            <!-- /.modal-content -->
          </div>
          <!-- /.modal-dialog -->
        </div>
        <!-- /.modal -->

    </section>

    <script type="text/javascript">
        $(function(){
            $('#uploadExcelBtn').on('click', function(){
                $('#uploadExcelModal').modal('show');
            })

            $('.order-delete').on('click', function(){
                if(confirm('您正在尝试删除该订单， 请注意删除后数据不可找回， 是否继续？')){
                    $.post('/amazonOrder/deleteOrder', {id: $(this).attr('data-id')}).then(function(res){
                        window.location.reload();
                    }, function(e) {
                        console.log(e)
                    })
                }   
            })

            $('#uploadExcelAndCreateOrder').on('click', function(){
                if($("#amazonOrderExcelFile")[0].files.length < 1) return;
                var formData = new FormData();
                formData.append("amazonOrderExcel", $("#amazonOrderExcelFile")[0].files[0]);
                $.ajax({
                    url: '/amazonOrder/uploadExcel',
                    data: formData,
                    type: 'post',
                    dataType: 'json',
                    cache: false,
                    contentType: false,
                    processData: false,
                    success: function(data) {
                        $('#uploadExcelModal').modal('hide');
                        window.location.reload();

                    },
                    error: function(){
                        console.log('获取失败')
                    }
                })
            })

        })
    </script>
 </div>